@import './variables/index.css';
@import './mui.css';

/* stop body from scrolling */
html,
body {
  margin: 0;
  height: 100%;
  overflow: hidden;
}

input,
textarea {
  outline: 0;
  background: transparent;
}

body {
  font-family: Poppins;
}

::selection {
  @apply bg-content-blue-100;
}

div[role="textbox"] ::selection {
  @apply bg-transparent;
}

:root[data-dark-mode=true] body {
    scrollbar-color: #fff var(--bg-body);
}

body {
    scrollbar-track-color: var(--bg-body);
    scrollbar-shadow-color: var(--bg-body);
}

.btn {
  @apply rounded-xl border border-line-divider px-4 py-3;
}

.btn-primary {
  @apply bg-fill-default text-text-title hover:bg-fill-list-hover;
}

.input {
  @apply rounded-xl border border-line-divider px-[18px] py-[14px] text-sm;
}


th {
  @apply text-left font-normal;
}

span[data-slate-placeholder="true"]:not(.inline-block-content) {
  @apply text-text-placeholder;
  opacity: 1 !important;
}

.sketch-picker {
    background-color: var(--bg-body) !important;
    border-color: transparent !important;
    box-shadow: none !important;
}
.sketch-picker .flexbox-fix {
    border-color: var(--line-divider) !important;
}
.sketch-picker [id^='rc-editable-input'] {
    background-color: var(--bg-body) !important;
    border-color: var(--line-divider) !important;
    color: var(--text-title) !important;
    box-shadow: var(--line-border) 0px 0px 0px 1px inset !important;
}
